<template>
    <div class="goodList">
        <head-top></head-top>
        <div class="body">
            <div class="seach">
                <el-button type="primary" @click="add">新增分类</el-button>
                <el-button type="primary" @click="ondel">批量删除</el-button>
            </div>
            <div class="table">
                <el-table
                    :data="tableData"
                    style="width: 100%"
                    row-key="id"
                    border
                    lazy
                    >
                    <el-table-column
                    prop="date"
                    label="日期"
                    width="180">
                    </el-table-column>
                    <el-table-column
                    prop="name"
                    label="姓名"
                    width="180">
                    </el-table-column>
                    <el-table-column
                    prop="address"
                    label="地址">
                    </el-table-column>
                </el-table>
            </div>
            <div class="block">
                <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :page-sizes="[10, 20, 50, 100]"
                    :page-size="10"
                    layout="total, sizes, prev, pager, next"
                    :total="400">
                </el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
    import headTop from '../../components/headTop'
    import {findItemCat} from '@/api/getData'
        export default {
        data(){
            return {
                formInline: {
                    user: '',
                    region: '',
                    state:"1",
                    time: '',
                    inventoryStart:"",
                    inventoryEnd:"",
                    priceStart:"",
                    priceEnd:""
                },
                loading: true,
                tableData: [{
                    id: 1,
                    date: '2016-05-02',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                    }, {
                    id: 2,
                    date: '2016-05-04',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1517 弄'
                    }, {
                    id: 3,
                    date: '2016-05-01',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1519 弄',
                    hasChildren: true
                    }, {
                    id: 4,
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1516 弄'
                    }]
            }
        },
        components: {
    		headTop,
    	},
        created(){
            this.loading = true;
        	this.getFoods();
        },
        computed: {
        	
        },
        methods: {
            load(tree, treeNode, resolve) {
        setTimeout(() => {
          resolve([
            {
              id: 31,
              date: '2016-05-01',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1519 弄'
            }, {
              id: 32,
              date: '2016-05-01',
              name: '王小虎',
              address: '上海市普陀区金沙江路 1519 弄'
            }
          ])
        }, 1000)
      },
            ondel() {
                this.getFoods()
                console.log(this.formInline);
            },
            handleSizeChange(val) {
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange(val) {
                console.log(`当前页: ${val}`);
            },
            add(){
                this.$router.push('addgoods')
            },
            async getFoods(){
                const Foods = await findItemCat();
                // this.tableData = [];
                // this.tableData = Foods.data;
                this.loading = false;
            },
        },
    }
</script>
<style lang="less">
    .body{
        padding: 0 20px;
    }
    .seach{
        padding-top: 15px;
    }
    .table{
        margin-top: 15px;
    }
    .block{
        margin-top: 15px;
        padding-bottom: 30px;
    }
</style>